<%@page import="org.proddevplm.dao.data.activities.Activity"%>
<%@page import="org.proddevplm.dao.data.designInputs.CTQs"%>
<%@page import="org.proddevplm.dao.data.requirements.VOCTable"%>
<%@page import="java.util.List"%>
<%@page import="org.proddevplm.constants.ControllerConstants"%>
<%@page import="org.proddevplm.business.tools.constants.ToolsConstants" %>
<%@page import="org.proddevplm.business.activity.constants.ActivityConstants" %>

<script>

	$(function(){
		$( "button" ).button();
		$("#ctqsButtonset").buttonset();
		$("#allCTQContent").hide();
		$("#ctqSupInfoTable").tablesorter({
			widgets:['zebra']
		})
		
		$("#exCTQTable").tablesorter({
			widgets:['zebra'],
			headers:{
				0:{sorter: false}
			}
		})
		
		$("#reviewCTQ").tablesorter({
			widgets:['zebra'],
			headers:{
				0: {sorter: false},
				4: {sorter: false},
			}
		})
	});
	
	$(document).ready(function(){ 
		$("#ctqSupportInfo").hide();
		$("#ctqHelpFiles").hide();
		$("#showExistingCtqs").hide();
	});
	
	$("#ctqInput").keyup(function(event){
		if(event.keyCode == 13){
			$("#addCtq").click();
		}
	});
	
	function showCTQSupport(){
		$("#ctqHelpFiles").hide();
		$("#showExistingCtqs").hide();
		$("#ctqSupportInfo").show();
	}
	
	function showCTQHelp(){
		$("#ctqSupportInfo").hide();
		$("#showExistingCtqs").hide();
		$("#ctqHelpFiles").show();
	}
	
	function hideAllCTQHelp(){
		$("#ctqSupportInfo").hide();
		$("#ctqHelpFiles").hide();
		$("#showExistingCtqs").hide();
	}
	
	function viewExistingCTQs(){
		$("#ctqSupportInfo").hide();
		$("#ctqHelpFiles").hide();
		$("#showExistingCtqs").show();
	}
	
	function addCtq(){
		var text = document.getElementById('ctqInput').value;
		var select = document.getElementById('characteristicSelect');
		
		if(text!=null && text!=""){
			select.options[select.options.length] = new Option(text);
			document.getElementById('ctqInput').value = null;
		}
	}
	
	function removeCtq(){
		$("#characteristicSelect option").each(function(){
			if(this.selected){
				$(this).remove();
			}
		});
	}
	
	function clearAllCtqs(){
		$('#characteristicSelect >option').remove();
	}
	
	function submitCtqs(){
		var index = 0;
		var list = '';
		$("#characteristicSelect option").each(function(){
			if(index++>0){
				list+='~';
			}
			list+=$(this)[0].value;
		});
		
		$("#ctqsList").val(list);
		
		var activityName = document.getElementById('activitySelect').value;
		$("#activityName").val(activityName);
		
		document.forms['submitCtqsForm'].submit();
	}
	
	function removeCTQS(ctqName, tRow){
		var confirmCTQDeletion = confirm("Do you want to remove this characteristic?");
		if(confirmCTQDeletion){
			var arguments = "ctqName="+ctqName;
			var tableRow = tRow;
			$("#"+tableRow).hide();
			ajaxCall("toolsManager", "19", arguments, null);
			alert('Characteristic deleted successfully');
		}
	}
	
	function approveActivity(name){
		$("#activityName").val(name);
		document.forms['approveForm'].submit();
	}
	
	function rejectActivity(name){
		$("#activityName").val(name);
		$("#rejectDialog").dialog("open");
	}
	
	$( "#rejectDialog" ).dialog({
		autoOpen: false,
		height: 350,
		width: 350,
		modal: true,
		buttons: {
			"Propose change": function() {
				var name = document.getElementById("activityName").value;
				var arguments = "activityName="+name+"&"+buildParameter("changeSubject")+"&"+buildParameter("changeDetails");
				ajaxCall("toolsManager", "21", arguments, forward);
				$( this ).dialog( "close" );
				},
			Cancel: function() {
				$( this ).dialog( "close" );
			}
		},
		close: function() {
			$( this ).dialog( "close" );
		}
	});
	
	function forward(data){
		document.forms["rejectForm"].submit();
	}

</script>

<%
	List voct = (List)session.getAttribute("allVOCLines");
	List allCtqs = (List)session.getAttribute("allCtqs");
	List<Activity> activitiesForUser = (List)session.getAttribute("activitiesForUser");
	List<CTQs> ctqByActName = (List)session.getAttribute("ctqByActName");
%>

<div class="pageTitle">
	<div style="text-align:left;">
		<a href="/proddev/controller?manager=dataAccessManager&method=21">
			<img src="/proddev/images/arrowleft.png" align="middle" height="20" width="30" style="border:0px"></a>
	</div>
	<p style="font-size:small; font-weight:bold; margin-top:-20px">Critical-to-Quality characteristics</p>

</div>

<%if(ctqByActName==null){ %>
<div style="margin:10 0 0;">
	<div style="float:left; text-align:left; font-weight:bold; color:#555555">
		Please choose the activity you want to complete
	</div>
	<select class="regInput" id="activitySelect" name="activitySelect" onchange="$('#allCTQContent').show()" size="1" style="width:25%; float:left; margin-left:10px">
		<option SELECTED>-select activity-</option>
		<%if(activitiesForUser!=null){
			for(int i=0; i<activitiesForUser.size(); i++) {
				Activity activity = (Activity)activitiesForUser.get(i);%>
				<option value="<%=activity.getName()%>"><%=activity.getName() %></option>
			<%}
		}
		%>
	</select>
	<div style="clear:both"></div>
</div>
<div id="allCTQContent">
	<div id="ctqsButtonset" style="width:100%; margin-top:10px; text-align:left;">
		<input type="radio" name="radio" id="showCTQSupport" onclick="showCTQSupport()" /><label for="showCTQSupport"><b>Show support information</b></label>
		<input type="radio" name="radio" id="viewExistingCTQs" onclick="viewExistingCTQs()" /><label for="viewExistingCTQs"><b>View existing CTQs</b></label>
		<input type="radio" name="radio" id="showCTQHelp" onclick="showCTQHelp()" /><label for="showCTQHelp"><b>Show help files</b></label>
		<input type="radio" name="radio" id="hideAllCTQHelp" onclick="hideAllCTQHelp()" /><label for="hideAllCTQHelp"><b>Hide all help information</b></label>
	</div>
	
	<div id="ctqSupportInfo" style="width:100%; margin-top:10px;">
	
		<table id="ctqSupInfoTable" class="tablesorter" border="1" cellspacing="0" cellpadding="3" rules="rows" frame="hsides" bordercolor="#DBDBDB" style="width:100%;">
			<thead>
				<tr style="font-size:x-small; text-align:left;background-color:#EEE0E5">
					<th style="width:30%">Stated requirement</th>
					<th style="width:10%">Stakeholder</th>
					<th style="width:45%">Preliminary critical-to-quality characteristic</th>
					<th style="width:15%">Author</th>
				</tr>	
			</thead>
			<tbody>
				<%if(voct!=null){
					for(int i=0; i<voct.size(); i++) {
						VOCTable vocLine = (VOCTable)voct.get(i);%>
						<tr style="font-size:x-small;">
							<td><%=vocLine.getRequirement()%></td>
							<td><%=vocLine.getStakeholder()%></td>
							<td style="text-align:left">		
								<%String whats = vocLine.getWhats();
								String[] whatsArray = whats.split("~");
								for(int k=0; k<whatsArray.length; k++){%>
									<%=whatsArray[k]+"</br>" %>
								<%}%>
							</td>
							<td><%=vocLine.getAuthor()%></td>
						</tr>
					<%}
				}
				%>
			
			</tbody>
	
		</table>
	
	</div>
	
	<div id="ctqHelpFiles" style="width:100%; margin-top:10px; text-align:left;">
		<a >link 1</a><br/>
		
		<a>link 2</a>
	</div>
	
	<div id="showExistingCtqs" style="width:100%; margin-top:10px; text-align:left;">
		<table id="exCTQTable" class="tablesorter" border="1" cellspacing="0" cellpadding="3" rules="rows" frame="hsides" bordercolor="#DBDBDB" style="width:100%;">
			<thead>
				<tr style="font-size:x-small; text-align:left; background-color:#EEE0E5">
					<th style="width:5%; text-align: center;">Crt. no.</th>
					<th style="width:55%">Critical to quality characteristic</th>
					<th style="width:20%">Author</th>
					<th style="width:20%">Date</th>
				</tr>	
			</thead>
			<tbody>
				<%if(allCtqs!=null){
					for(int i=0; i<allCtqs.size(); i++){
						CTQs ctq = (CTQs)allCtqs.get(i);%>
						<tr style="font-size:x-small;">
							<td style="text-align:center;"><%=i+1 %></td>
							<td><%=ctq.getCtq() %></td>
							<td><%=ctq.getAuthor() %></td>
							<td><%=ctq.getDate() %></td>
						</tr>
					<%}
				}
				%>
			</tbody>
		</table>
	</div>
	
	<p style="margin-top:10px; background-color:#E6E6FA; font-weight:bold">Please define all critical to quality characteristics for the product</p>
	
	<div style="width:100%; margin-top:10px;">
		<div style="float:left; width:15%; text-align:left; padding:2px;">
			<b>Characteristic:</b>
		</div>
		<div style="float:left; width:75%;">
			<input id="ctqInput" type="text" style="width:100%"/>
		</div>
		<button id="addCtq" name="addCtq" onclick="addCtq()" style="width:8%; font-weight:bold; font-size:x-small;float:left; margin-left:5px;">Add</button>
		<div style="clear:both"></div>
	</div>
	
	<div style="width:100%; margin-top:10px; ">
		<select id="characteristicSelect" size="5" style="width:100%; border:none">
			
		</select>
		<div id="ctqsButtons" style="margin-top: 5px; font-size:x-small;">
			<button id="removeCtq" name="removeCtq" onclick="removeCtq()" style="width:200px; font-weight: bold; float:left;">Remove element</button>
			<button id="clearAllCtqs" name="clearAllCtqs" onclick="clearAllCtqs()" style="width:200px; font-weight:bold; float:center;">Clear all characteristics</button>
			<button id="submitCtqs" name="submitCtqs" onclick="submitCtqs()" style="width:200px; font-weight:bold; float:right">Submit all</button>
		</div>
		
		<div style="clear:both"></div>
	</div>
	<form name="submitCtqsForm" method="post" action="/proddev/controller">
		<input type = "hidden" name = "<%=ControllerConstants.MANAGER_KEY%>" value = "<%=ControllerConstants.TOOLS_MANAGER%>"/>
		<input type = "hidden" name = "<%=ControllerConstants.METHOD_KEY%>" value = "<%=ToolsConstants.CTQS%>"/>
		<input id="ctqsList" name="ctqsList" type="hidden"/>
		<input type="hidden" id="activityName" name="activityName"/>
	</form>
</div>
<%}else{%>
	<div style="width:100%; margin-top:10px; text-align:left; ">
		<table id="reviewCTQ" class="tablesorter" border="1" cellspacing="0" cellpadding="3" rules="rows" frame="hsides" bordercolor="#DBDBDB" style="width:100%;">
			<thead>
				<tr style="font-size:x-small; text-align:left; background-color:#EEE0E5">
					<th style="width:5%; text-align: center;">Crt. no.</th>
					<th style="width:50%">Critical-to-quality characteristic</th>
					<th style="width:20%">Author</th>
					<th style="width:20%">Date</th>
					<th style="text-align:center">Action</th>
				</tr>	
			</thead>
			<tbody>
				<%for(int i=0; i<ctqByActName.size(); i++){
					CTQs c = (CTQs)ctqByActName.get(i);%>
					<tr id="row<%=i+1 %>" style="font-size:x-small;">
						<td style="text-align:center;"><%=i+1 %></td>
						<td><%=c.getCtq() %></td>
						<td><%=c.getAuthor() %></td>
						<td><%=c.getDate() %></td>
						<td style="text-align:center"><img src="/proddev/images/delete1.png" onclick="removeCTQS('<%=c.getCtq()%>', 'row<%=i+1%>')" align="middle" width="20" height="20"/>
					</tr>
				<%}%>
			</tbody>
		</table>
	</div>
	<%CTQs c = ctqByActName.get(0);
	String activityName = c.getActivityName();%>
	<div style="width:100%">
		<button id="rejectActivity" name="rejectActivity" onclick="rejectActivity('<%=activityName%>')" style="width:150px; font-weight: bold; float:left">Reject activity</button>
		<button id="approveActivity" name="approveActivity" onclick="approveActivity('<%=activityName%>')" style="width:150px; font-weight: bold; float:right">Approve activity</button>
		<div style="clear:both"></div>
	</div>
	
	<div id="rejectDialog" title="Propose changes" style="display:none">
		<jsp:include page="/pages/content/project/devTools/workspace/changes/changeReport.jsp"></jsp:include>
	</div>
	
	<form name="rejectForm" method="post" action="/proddev/controller" style="margin:0px">
		<input type = "hidden" name = "<%=ControllerConstants.MANAGER_KEY%>" value = "<%=ControllerConstants.TOOLS_MANAGER%>"/>
		<input type = "hidden" name = "<%=ControllerConstants.METHOD_KEY%>" value = "<%=ToolsConstants.STAKEHOLDERS_FWD%>"/>
	</form>
	
	<form name="approveForm" method="post" action="/proddev/controller" style="margin:0px">
		<input type = "hidden" name = "<%=ControllerConstants.MANAGER_KEY%>" value = "<%=ControllerConstants.ACTIVITY_MANAGER%>"/>
		<input type = "hidden" name = "<%=ControllerConstants.METHOD_KEY%>" value = "<%=ActivityConstants.UPDATE_ACTIVITY%>"/>
		<input type="hidden" name="activityName" id="activityName">
	</form>
<%}%>